<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition template="master.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:p="http://primefaces.org/ui"
                xmlns:c="http://java.sun.com/jsp/jstl/core">
    
    <ui:define name="title">
        Test bestemming
    </ui:define>
    
    <ui:define name="content">
        
        <h1>Testje bestemming</h1>

        <h:form>
            <p>
                <h:outputLabel id="bestemmingContinentLabel" for="selectContinent" value="Continent: " />
                <!-- <h:inputText id="bestemmingContinent" value="#{bestemmingController.continent}"></h:inputText> -->

                <h:selectOneMenu id="selectContinent" value="#{bestemmingController.continent}">
                    <f:selectItems value="#{continentController.continenten}" var="continent" itemLabel="#{continent.continentNaam}" itemValue="#{continent.id}"/>
                </h:selectOneMenu>
            </p>
            
            <p>
                <h:outputLabel id="bestemmingNaamLabel" for="bestemmingNaam" value="Naam: " />
                <h:inputText id="bestemmingNaam" value="#{bestemmingController.naam}" required="true"></h:inputText>
            </p>
            
            <p>
                <h:commandButton value="Submit" action="#{bestemmingController.insertBestemming()}"/>
            </p>
        </h:form>
        
        <h:dataTable var="bestemming" value="#{bestemmingController.bestemmingen}">
            <h:column>
                <f:facet name="header">
                    <h:outputText value="Bestemming"/>
                </f:facet>
                <h:outputText value="#{bestemming.continent}"/>
            </h:column>
            <h:column>
                <f:facet name="header">
                    <h:outputText value="Land"/>
                </f:facet>
                <h:outputText value="#{bestemming.naam}"/>
            </h:column>
        </h:dataTable>
        
    </ui:define>  
</ui:composition>
